<template>
  <div class="img_box" @click="$goPage('/info?id=' + id)">

    <Row type="flex">
      <Col span="8"><img class="img" :src="img_path"></Col>
      <Col span="16">
        <div class="title">{{ title }}</div>
        <div class="desc">{{intro}}</div>
        <div class="author">￥{{ author }}.00 元</div>
      </Col>
    </Row>
  </div>
</template>

<script>
export default {
  name: "Book2.vue",
  props: {
    img_path: String,
    title: String,
    intro: String,
    author: String,
    id: String,

  }
}
</script>

<style scoped>
.img_box {
  width: 100%;
  padding: 10px 0;
  border-bottom: 1px solid #DDD;
}

.img {
  width: 100px;
  height: 150px;
  border-radius: 10px;
  margin-top: 10px;
}

.title {
  font-weight: bold;
  margin: 10px 0;
  color: #000;
}

.desc {
  max-height: 63px;
  overflow: hidden;
  margin-bottom: 30px;
}

</style>
